<template>
	<view class="page">
		<u-navbar title="企业管理" :autoBack="true" :fixed="true" :bgColor="`rgba(39,106,238,${navbarOpacity})`"
			leftIconSize="20px" leftIconColor="#fff" :titleStyle="{color:'#fff'}"
			@leftClick="navbarLeftClick"></u-navbar>

		<view class="company-box" :style="{'--top-status-bar-height':statusBarHeight+'px'}">
			<text class="company-name">{{companyInfo.company}}</text>

			<view v-if="companyInfo.status===1" class="company-status-blue opactive-hover" @click="editHandle">
				<u-icon name="edit-pen" color="#276AEE" size="30rpx"></u-icon>
				<text style="margin-left: 8rpx;">编辑</text>
			</view>
			<view v-else-if="companyInfo.status===0" class="company-status opactive-hover">审核中</view>
			<view v-else-if="companyInfo.status===2" class="company-status opactive-hover" @click="editHandle">
				<text>认证未通过</text>
				<text style="font-size: 18rpx;">(点击修改)</text>
			</view>
		</view>

		<!-- 功能栏 -->
		<view class="grid-box" v-if="!auditCompanyId">
			<view class="grid-item" @tap="$goToPage('/pagesParty/companyManger/memberAudit')">
				<u-image width="80rpx" height="80rpx"
					src="https://file.casugn.com/storecompcard/static/img/金刚区图标@2x_1681868348547.png"></u-image>
				<text class="grid-item__name">名片审核</text>
			</view>
			<view class="grid-item" v-if="userInfo.roleIdentify===1"
				@tap="$goToPage('/pagesParty/companyManger/memberList')">
				<u-image width="80rpx" height="80rpx"
					src="https://file.casugn.com/storecompcard/static/img/金刚区图标@2x (1)_1681868333996.png"></u-image>
				<text class="grid-item__name">人员管理</text>
			</view>
			<view class="grid-item" v-if="userInfo.roleIdentify===1"
				@tap="$goToPage('/pagesParty/companyIndexAddOrEdit/companyIndexAddOrEdit')">
				<u-image width="80rpx" height="80rpx"
					src="https://file.casugn.com/storecompcard/static/img/金刚区图标@2x (2)_1681868316912.png"></u-image>
				<text class="grid-item__name">公司简介</text>
			</view>
			<view class="grid-item" @tap="$goToPage('/pagesCard/addProductManger/addProductManger')">
				<u-image width="80rpx" height="80rpx"
					src="https://file.casugn.com/storecompcard/static/img/金刚区图标@2x (3)_1681868265558.png"></u-image>
				<text class="grid-item__name">产品管理</text>
			</view>
			<view class="grid-item" @tap="$goToPage('/pagesMall/myOrder/companyOrderList')">
				<u-image width="80rpx" height="80rpx"
					src="https://file.casugn.com/storecompcard//yIVyHkHiV9fP66abb35211b28af05a8a122457dcb60a_1705020554334.png"></u-image>
				<text class="grid-item__name">企业订单</text>
			</view>
		</view>

		<!-- 审核 -->
		<view class="audit-box" v-if="!auditCompanyId">
			<view class="audit-title">待审核</view>
			<audit-list :list="items" cardId="cardId" :showOperate="true" @refresh="whenRefresh"></audit-list>

			<template v-if="loadMoreStatus!=='loading'&&!items.length">
				<u-empty width="240rpx" height="240rpx" text="暂时没有审核" textSize="28rpx" textColor="#86909C"
					icon="https://file.casugn.com/storecompcard/temp/空页面@2x(11)_1681113828976.png"></u-empty>
			</template>

			<template v-if="loadMoreStatus==='loading'">
				<u-loadmore height="100" fontSize="28rpx" iconSize="34rpx" :status="loadMoreStatus"
					@loadmore="scrolltolower" />
			</template>
		</view>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	import AuditList from './components/audit-list.vue'

	export default {
		components: {
			AuditList
		},
		data() {
			return {
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
				navbarOpacity: 0,
				auditCompanyId: '', // 企业认证审核中时的企业ID

				companyInfo: {},

				items: [],
				pageNo: 1,
				pageSize: 10,
				loadMoreStatus: 'nomore', //loading / nomore / loadmore
			}
		},
		computed: {
			...mapGetters(['userInfo']),
		},
		onLoad(option) {
			// 企业认证审核中时的企业ID-主要是为了体现审核中状态
			this.auditCompanyId = option.auditCompanyId
			this.getCompanyManage()

			if (!this.auditCompanyId) {
				this.loadMoreStatus = 'loading'
				this.getDBData()
			}
		},
		onPageScroll(e) {
			// console.log(e);
			this.navbarOpacity = e.scrollTop / 100 > 1 ? 1 : (e.scrollTop / 100)
		},
		onReachBottom() {
			this.scrolltolower()
		},
		methods: {
			navbarLeftClick() {
				let pages = getCurrentPages(); // 获取当前页面栈
				if (pages.length > 1) {
					uni.navigateBack()
				} else {
					uni.redirectTo({
						url: '/pages/card/card'
					})
				}
			},
			editHandle() {
				// 跳转企业认证编辑 普通0 超管1 管理2
				if (!this.userInfo.companyId || this.userInfo.roleIdentify !== 1) {
					uni.showToast({
						title: '您无权限操作',
						icon: 'none'
					});
				}

				uni.navigateTo({
					url: `/pagesParty/companyAttestationEdit/companyAttestationEdit?companyId=${this.userInfo.companyId||''}`
				})
			},
			//公司审核信息
			async getCompanyManage() {
				//判断公司信息和个人信息 
				let params = {
					id: this.userInfo.companyId || this.auditCompanyId || ''
				}
				let res = await this.$api.queryCompanyManage(params)
				if (res.success) {
					this.companyInfo = res.result || {}
				}
			},
			async getDBData(type = 'refresh') {
				let params = {
					pageNo: this.pageNo,
					pageSize: this.pageSize,
					companyId: this.userInfo.companyId,
					isDel: 0,
					status: 0,
					column: 'createTime',
					order: 'desc',
				}
				let res = await this.$api.queryCardExamineList(params)
				if (res.success) {
					let tData = res.result.records
					if (type === 'refresh') {
						this.items = tData
					}
					if (type === 'add') {
						this.items.push(...tData)
					}
					console.log('名片审核列表：', this.items);
					this.loadMoreStatus = res.result.pages > res.result.current ? 'loadmore' : 'nomore'
				} else {
					this.loadMoreStatus = 'nomore'
				}
			},
			scrolltolower() {
				if (this.loadMoreStatus === 'nomore') {
					return
				}
				this.loadMoreStatus = 'loading';
				this.pageNo += 1
				this.getDBData('add')
			},
			refresherrefresh() {
				this.loadMoreStatus = 'loading'
				this.items = []
				this.pageNo = 1
				setTimeout(async () => {
					await this.getDBData('refresh')
				}, 500)
			},
			whenRefresh(list) {
				this.items = list
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F8F9FF;
	}

	.page {
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}

	.company-box {
		padding: 40rpx 32rpx 48rpx;
		padding-top: calc(40rpx + 44px + var(--top-status-bar-height));
		background-image: url('https://file.casugn.com/storecompcard/static/img/bg@2x_1681801157724.png');
		background-repeat: no-repeat;
		background-size: 100%;

		display: flex;
		justify-content: space-between;
		align-items: center;

		.company-name {
			margin-right: 20rpx;
			font-size: 32rpx;
			font-weight: 600;
			color: #fff;
			line-height: 44rpx;
		}

		.company-status {
			padding: 4rpx 8rpx 2rpx;
			font-size: 24rpx;
			color: #FF7D00;
			line-height: 34rpx;
			background-color: #FFF7E8;
			border-radius: 4rpx;
			flex: 0 0 auto;

			display: flex;
			justify-content: center;
			align-items: center;
		}

		.company-status-blue {
			padding: 8rpx 32rpx;
			font-size: 28rpx;
			color: #276AEE;
			line-height: 40rpx;
			background-color: #E9F0FD;
			border-radius: 4rpx;
			flex: 0 0 auto;

			display: flex;
			justify-content: center;
			align-items: center;
		}
	}

	.grid-box {
		background-color: #fff;

		display: flex;
		align-items: center;

		.grid-item {
			width: 100%;
			padding: 20rpx;

			display: flex;
			flex-direction: column;
			align-items: center;

			.grid-item__name {
				margin-top: 8rpx;
				font-size: 26rpx;
				color: #1D2129;
				line-height: 40rpx;
			}
		}
	}

	.audit-box {
		padding-top: 24rpx;

		.audit-title {
			padding: 26rpx 32rpx;
			font-size: 32rpx;
			font-weight: 600;
			color: #1D2129;
			line-height: 44rpx;
		}
	}
</style>